<div class="kgo-login-page-sty">
        <h2 style="color:#5FB878;position: relative;top:100px;">测试账户admin/admin</h2>
        <table class="layui-table kgo-login-table-sty" lay-skin="nob">
                <colgroup>
                    <col width="20%">
                    <col width="80%">
                </colgroup>      
                <tbody>
                    <tr>
                        <td class="kgo-input-td"><i class="layui-icon layui-icon-username"></i>用户名</td>
                        <td class="kgo-input-td"><input id="userName" name="name" type="text" class="kgo-login-input"/></td>
                    </tr>
                    <tr>
                        <td class="kgo-input-td"><i class="layui-icon layui-icon-password"></i>密码</td>
                        <td class="kgo-input-td"><input id="password" name="name" type="password" class="kgo-login-input"/></td>
                    </tr>
                    <tr>
                        <td class="kgo-input-td"></td>
                        <td class="kgo-input-td">
                            <button class="layui-btn layui-btn-fluid" id="kgo-login">登录</button>
                        </td>
                        
                    </tr>
                </tbody>
            </table>
</div>

<script src="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.min.js"></script>

<script type="text/javascript">
var valid_login_time = 1;//一天的有效时间（单位天）
$(function(){
    $('#userName').val(Cookies.get('username'));
    $('#password').val(Cookies.get('password'));
});
 $('#kgo-login').on('click',function(){
     var user_name =  $('#userName').val();  
     var _password = $('#password').val();
     if(KgoUtil.objIsNull(user_name)){
        layer.msg("用户名不能为空！");
        setTimeout(function(){
            $('#userName').focus();
        },300)
        return ;
     }
     if(KgoUtil.objIsNull(_password)){
        layer.msg("密码不能为空！");
        setTimeout(function(){
            $('#password').focus();
        },300)
        return ;
     }
     
     var md5_password = null;
     //如果cookie的密码不是空，并且当前的密码和cookie的密码一致
     if(KgoUtil.objIsNotNull(Cookies.get('password'))&&_password.length==32&&_password==Cookies.get('password')){
         md5_password = Cookies.get('password');
     }else{ 
         md5_password = md5(md5(_password));
     }
     

     var rootUrl = KgoUtil.getState("rootUrl");
     var login_url = rootUrl + "/login";
     var login_obj ={"userName":user_name,"password":md5_password};
     $.post(login_url,login_obj,function(result){
        if(result.success){
            KgoUtil.setState("UserInfo",result.data);
            Cookies.set('username', result.data.userName,{ expires: valid_login_time });
            Cookies.set('userId', result.data.id,{ expires: valid_login_time });
            Cookies.set('password', result.data.password,{ expires: valid_login_time });
            Cookies.set('isLogin', true,{ expires: valid_login_time });
            layer.closeAll();
            layer.msg(result.msg);
            return;
        }else{
            Cookies.set('userId', null,{ expires: valid_login_time });
            Cookies.set('isLogin', false,{ expires: valid_login_time });
        }
        layer.msg(result.msg);
     },"json");
 });
</script>
<style>
.kgo-login-page-sty{
    width: 100%;
    height: 100%;
    background-color: #f2f2f2;
    text-align: center;
}
.kgo-login-table-sty{
    width: 350px;
    height: 200px;
    background-color: #f2f2f2;
    margin: 0 auto;  
    position: relative;
    top: 120px;
}
.kgo-login-table-sty .kgo-login-input{
    height: 35px;
    width: 95%;
}
.kgo-login-table-sty .kgo-input-td{
    text-align: right;
}
.kgo-login-table-sty .kgo-input-td i{
    margin-right: 5px;
}
</style>